<template>

  <div>
    <!-- 搜索 -->
    <MySearch @serachtran="serachtran" @addopenDialog="addopenDialog"/>
    <!-- 表格 -->
    <TableCom :arr='arr' @deltranfer="getLocalHost" @delAllFntran="getLocalHost" @bianjiFn="bianjiFn"/>
    <!-- 分页 -->
    <MyPage :page="page" :pagesize='pagesize' :total="total" @pagesizeFn='pagesizeFn' @pagetranf="pagetranf"/>
    <!-- 弹框 -->
    <MyDialog @updateFn="updateFn" :DialogType="DialogType" :DialogRow="DialogRow" v-if="show" @closeDia="closeDialog" @saveDiaLog="saveDiaLog"/>
  </div>
</template>

<script>
import MySearch from './components/MySearch.vue'
import TableCom from './components/TableCom.vue'
import MyPage from './components/MyPage.vue'
import MyDialog from './components/MyDialog.vue'

//请求 抛出的是函数
import {getHomeData,addHome} from '../../api/home1'


export default {
   
components:{
  MySearch,
  TableCom,
  MyPage,
  MyDialog
},
data(){
    return{
        search:'',
        arr:[],//全局数组
        page:1,
        pagesize:20,
        total:0,
        show:false,
        DialogRow:{},
        DialogType:0// 添加弹框0 修改弹框1
    }
},
mounted(){
      this.getLocalHost()
},
methods:{
    //编辑第一步
    bianjiFn(row){
        this.DialogRow =row
        this.DialogType=1
         this.show=true
    },
    //修改
    updateFn(){
        this.show=false
    },
    //保存
    saveDiaLog(obj){
        console.log(111);
        //添加
        addHome(obj).then(res=>{
            // console.log(res);
            if(res.code==200){
                this.getLocalHost()
                 this.show=false
                 this.DialogType=0
            }
        })
    },
    //打开弹出框
    addopenDialog(){
        this.show=true,
        this.getLocalHost()
    },
     //关闭弹框
    closeDialog(){
        this.show=false
    },
    //pagesize切换
    pagesizeFn(val){
        this.pagesize=val
        this.getLocalHost()
    },
    pagetranf(val){
        this.page = val,
        this.getLocalHost()
         page:1
    },
    //搜索
    serachtran(val){
        
       this.search =val
       this.getLocalHost()
    },
    
    getLocalHost(){
        //查询 支持分页
        //1 搜索查询公用一个接口
      var parmas={
        search:this.search,
        page:this.page,
        pagesize :this.pagesize
    }
        getHomeData(parmas).then(res=>{
            if(res.code==200){
                this.arr=res.data
                this.total =res.total
            }
        })
    }
}}
</script>
<style>

</style>